<template>
	<view class="zy-column-full">
		<zy-title title="50 ZONE"></zy-title>
		
		<scroll-view class="zy-scroll">
			<!-- 卡片1 -->
			<view>
				<view class="zy-row zy-bg-main-rt30 zy-ph-lg zy-pv">
					<image src="@/static/img/vip-white.png" style="width: 48rpx;" mode="widthFix"></image>
					<view class="zy-flex-width zy-text-yellow-sm zy-ml">Arter upering VIP,you can enioy10 times the oronotionxommisain od mambrs</view>
					<zy-button content="Renew" color="yellow" size="normal"></zy-button>
				</view>
				<view class="zy-row zy-bg-white-rb30 zy-p-lg">
					<view class="zy-column-center-v zy-flex-width">
						<view class="zy-row-center zy-text-black-sm zy-font-bold">Last week’achievement</view>
						<view class="zy-text-main-lg-bold zy-mt">5%</view>
						<view class="zy-text-gray-light-sm zy-font-bold zy-mt">Last</view>
					</view>
					<view style="width: 1px; height: 134rpx; background-color: #ccc;"></view>
					<view class="zy-column-center-v zy-flex-width">
						<view class="zy-row-center zy-text-black-sm zy-font-bold">Tis week’s achievement</view>
						<view class="zy-text-main-lg-bold zy-mt">10%/5%</view>
						<view class="zy-text-gray-light-sm zy-font-bold zy-mt">achievement</view>
					</view>
				</view>
			</view>
			<!-- 2:时间 -->
			<view class="zy-column-center-center zy-pv-sm zy-mt-lg" style="background-color: #E6201C;">
				<view class="zy-text-white-sm zy-font-bold">Today</view>
				<view class="zy-text-white-sm zy-font-bold">0:00-20:59</view>
			</view>
			<view class="zy-row-between zy-p-lg" style="background-color: #FFF4E2;">
				<view class="zy-text-black-sm zy-font-bold">Prodect of the day</view>
				<view class="zy-row">
					<view class="zy-text-black-sm zy-font-bold">End at</view>
					<view class="zy-row-center time">11</view>
					<view class="zy-text-black-sm zy-font-bold">:</view>
					<view class="zy-row-center time">11</view>
					<view class="zy-text-black-sm zy-font-bold">:</view>
					<view class="zy-row-center time">11</view>
				</view>
			</view>
			<!-- 3:item -->
			<view class="zy-row-top zy-p-lg">
				<image :src="getTestImage()" class="img"></image>
				<view class="zy-flex-width zy-ml">
					<view class="zy-row zy-bg-black-r5">
						<image src="../../static/img/vip_3.png" style="width: 30rpx;" mode="widthFix"></image>
						<view class="zy-row-center zy-flex-width">
							<zy-price color="yellow" :bolded="false" price="2.55"></zy-price>
						</view>
						<image src="../../static/img/vip_3.png" style="width: 30rpx;" mode="widthFix"></image>
					</view>
					<view class="zy-text-black-sm-super zy-mt">CURREN Top Brand Luxuy Men’s
							Watches Fashion Quartz
							Chronograph Men Sport
							Waterproof Watch Business
							Casual Leather Strap Men Watch</view>
					<view class="zy-row zy-mt">
						<image :src="getTestImage()" style="width: 50rpx; height: 50rpx; border-radius:5rpx"></image>
						<view class="zy-flex-width zy-text-gray-sm-super zy-ml">produk datang dari Lazada</view>
					</view>
					<view class="zy-text-gray-light-sm zy-mt-50">Subsidies</view>
					<view class="zy-row-between">
						<zy-price color="red" price="1999.00"></zy-price>
						<zy-button content="Renew" size="sm"></zy-button>
						
					</view>
				</view>
				
			</view>
		</scroll-view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
.time{
	width: 52rpx;
	height: 52rpx;
	background: rgba(196,196,196,0.34);
	border-radius: 4rpx;
	font-size: 24rpx;
	font-weight: 600;
	color: #E6201C;
	margin-left: 10rpx;
	margin-right: 10rpx;
}
.img{
	width: 328rpx;
	height: 328rpx;
	background: #FAFAFA;
	border-radius: 22rpx;
	border: 2rpx solid #EBEBEB;
}
</style>
